<!DOCTYPE html>
<svg width="100" height="100">
  <rect id="ref" x="20" y="30" width="10" height="10" fill="red"></rect>
  <rect id="move" x="10" y="10" width="10" height="10" fill="green"></rect>
</svg>
<script src="../../../resources/run-after-layout-and-paint.js"></script>
<script src="../resources/text-based-repaint.js"></script>
<script>
testIsAsync = true;
window.onload = runRepaintAndPixelTest;

function repaintTest() {
    var transform = document.querySelector('svg').createSVGTransform();
    transform.matrix.e = 10;
    document.querySelector('#move').transform.baseVal.appendItem(transform);

    runAfterLayoutAndPaint(function() {
        transform.matrix.f = 20;
        finishRepaintTest();
    });
}
</script>
